.lyrics-float {
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-align: center;
  user-select: none;
  transform: matrix(1, 0, 0, 1, 0, 0);
  -webkit-app-region: drag;
  > div {
    position: absolute;
    left: 100%;
    width: 100%;
    height: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  div&-active {
    left: 0;
    @keyframes lyrics {
      100% {
        background-position: -200% 0;
      }
    }
    > div {
      display: inline;
      color: transparent;
      background-image: linear-gradient(
        to right,
        var(--base-color) 50%,
        black 0
      );
      background-position: -100% 0;
      background-clip: text;
      background-size: 200% 100%;
      animation-name: lyrics;
      animation-play-state: running;
      animation-fill-mode: forwards;
    }
  }
  div&-pause {
    > div {
      animation-play-state: paused;
    }
  }
  &-contanier {
    position: fixed;
    bottom: 120px;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100px;
    font-size: 56px;
    transform: matrix(1, 0, 0, 1, 0, 0);
  }
  &-electron {
    top: 0;
    left: 0;
    height: 100%;
  }
}
